let pageid = 0;

// 默认请求 第一页 数据  以及 确定 总页数
var changepage=document.querySelector("#changepage");
var product=document.querySelector("#product");
var change=document.querySelector("#change")
const xhr1 = new XMLHttpRequest();
xhr1.open("get","http://chst.vip:1234/api/getmoneyctrl?pageid="+pageid,true);
xhr1.onload = function(){
if(xhr1.status === 200){
let res1 = JSON.parse(xhr1.responseText)
console.log(res1);

let products = '';

let regExp = /(?<=imgurl=)[^'"]*/;

res1.result.forEach(item => {

let imgsrc = item.productImg2.match(regExp)[0];
 
products += `
                    <li class="productbox" id=${item.productId}>
                    <img src="${imgsrc}" alt="">  
                    <div class="right">
                    <h4>${item.productName}</h4>
                    <p class="bot">
                    <span>${item.productFrom} | ${item.productTime}</span>
                    <span><i class="iconfont icon-xiaoxixinxihuihuahuida"></i>${item.productComCount}</span>
                    </p>
                    </div>     
                    </li>
`
});

product.innerHTML = products;

var options = ""
let pageZ =  Math.floor(res1.totalCount / res1.pagesize);
console.log(pageZ);
for(var i=1;i<=pageZ;i++){
options += `<option value="${i}">${i}/${pageZ}</option>`
}
change.innerHTML = options;

product.pageZ = pageZ;
}
}
xhr1.send(null);

// 封装函数
function ajax(pageid){
const xhr1 = new XMLHttpRequest();
xhr1.open("get","http://chst.vip:1234/api/getmoneyctrl?pageid="+pageid,true);
xhr1.onload = function(){
if(xhr1.status === 200){
let res1 = JSON.parse(xhr1.responseText)
console.log(res1);

let products = '';

let regExp = /(?<=imgurl=)[^'"]*/;

res1.result.forEach(item => {

let imgsrc = item.productImg2.match(regExp)[0];


products += `
                    <li class="productbox" id=${item.productId}>
                        <img src="${imgsrc}" alt="">  
                        <div class="right">
                            <h4>${item.productName}</h4>
                            <p class="bot">
                              <span>${item.productFrom} | ${item.productTime}</span>
                              <span><i class="iconfont icon-xiaoxixinxihuihuahuida"></i>${item.productComCount}</span>
                            </p>
                        </div>     
                    </li>
`
});

product.innerHTML = products;

}
}
xhr1.send(null);
}


// 下一页
var next=document.querySelector("#after");

  next.onclick=function(){
      pageid++;
      if(pageid> product.pageZ){
        pageid = product.pageZ-1;
    }
    ajax(pageid);
    console.log(pageid);
    console.log(product.pageZ);
      let optionall = document.querySelectorAll("option");  
      optionall[pageid].selected = true;    
 }
//  上一页
var before=document.querySelector("#before");
before.onclick=function(){
    pageid--;
    if(pageid===-1){
      pageid=0;
    }
    ajax(pageid);
    let optionall = document.querySelectorAll("option");  
    optionall[pageid].selected = true; 
}
// select 选择事件
let changes=document.querySelector("#change");
changes.onclick=function(e){
  var e = e || window.event;
  var target = e.target || e.srcElement;

  pageid = target.value;
  ajax(pageid);

  let optionall = document.querySelectorAll("option");  
  optionall[pageid].selected = true; 

}
// 点击跳转详情页面事件

$("#product").click(function(e){

var e=e ||window.event;
var target=e.target ||e.srcElement;

if(target.nodeName ==="IMG" || target.nodeName === "DIV"){
 
                    proId=target.parentNode.id;
}else if(target.nodeName==="H4" ||target.nodeName==="P"){
    
                    proId=target.parentNode.parentNode.id
}else if(target.nodeName==="SPAN"){
  
                    proId=target.parentNode.parentNode.parentNode.id;
}else if(target.nodeName==="LI"){
 
                    proId=target.id
}

location.href="../html/savedetail.html?productid="+proId
})
